<!-- src/views/home/components/MainTitle mainTitle.vue 2023/5/25  @wanghaoran -->
<template>
  <div class="whr-base-card-main-title">{{ mainTitle }}</div>
</template>

<script setup>
defineProps({
  mainTitle: {
    type: String,
    default: ""
  },
})
</script>

<style scoped>
.whr-base-card-main-title {
  font-size: 16px;
  color: #292929;
  letter-spacing: 0;
  position: relative;
  margin-left: 15px;
}

.whr-base-card-main-title::before {
  content: '';
  display: block;
  width: 5px;
  height: 15px;
  border-radius: 3px;
  background: #477CFB;
  position: absolute;
  top: 0;
  left: -15px;
  bottom: 0;
  line-height: 22px;
  margin: auto;
}
</style>